import { useState } from 'react';

function ChildCom1() {

    const [points, setPoints] = useState({
        x: 0,
        y: 0
    })

    function handleMouseMove(e) {
        setPoints({
            x: e.clientX,
            y: e.clientY
        })
    }

    return (
        <div style={{
            width: '400px',
            height: '400px',
            backgroundColor: 'red'
        }} onMouseMove={handleMouseMove}>
            <h1>移动鼠标!</h1>
            <p>当前的鼠标位置是 ({points.x}, {points.y})</p>
        </div>
    );
}

export default ChildCom1;